<template>
	<view>
		<my-header :bgCol="col" :isHome="isHome"  :isBack="isBack">
			<block slot="backText">返回</block>
			<block slot="content">
				{{cur==3?"个人中心12":""}}
			</block>
		</my-header>
		<view class="top" v-if="cur!=3">
			<view class="back" v-if="isBack" @click="back()">返回</view>
			<scroll-view scroll-x class="bg-yellow nav text-center top-bar">
				<view class="cu-item" :class="0==tabCur?'text-white cur':''" @tap="tabSelect" data-id="0">
					<!-- <text class="cuIcon-triangleupfill"></text>  -->
					支出
				</view>
				<view class="cu-item" :class="1==tabCur?'text-white cur':''" @tap="tabSelect" data-id="1">
					<!-- <text class="cuIcon-triangledownfill"></text>  -->
					收入
				</view>
			</scroll-view>
		</view>
		<bookkeeping :tabCur="tabCur"  :income="income" :expend="expend" :cur="cur" :billInfo="billInfo" v-if="cur==0"></bookkeeping>
		<statistics  :tabCur="tabCur"  v-if="cur==1"></statistics>
		<detailed    :tabCur="tabCur" :income="income" :expend="expend"  :cur="cur" :datas="billList" v-if="cur==2"></detailed>
    	<me class="aa" :user="user" :navList="navList" v-show="cur==3"></me>
		<!-- <maps v-if="cur==1"></maps> -->
		<view class="bu"></view>
		<view class="footer row" :class="is_ipX?'foot_bottom':''">
			<view class="col" v-for="(item,index) in tabBarList" :key="index" @click="go(index)">
				<!-- <image class="icon" :src="cur==index?item.selectedIconPath:item.iconPath" mode="" /> -->
				<view class="icon" :class="cur==index?item.selectedIconPath:item.iconPath"></view>
				<view class="text" :class="cur==index?'cur':''">
					{{item.text}}
				<!-- <text class="iconfont  iconganbei"></text> -->
				</view>
			</view>
		</view>
	</view>
</template>

<script>
// Self-study exam

	import bookkeeping from './bookkeeping/bookkeeping.vue'
	import statistics from './statistics/statistics.vue'
	import detailed from './detailed/detailed.vue'
	import me from './me/me.vue'
	export default {
		data() {
			return {
				cur:0,
				tabCur:0,
				isBack:false,
				isHome:0,
				title:"",
				col:"#1989fa",
				// col:"#1129fa",
				tabBarList: [
					{
						// pagePath: "pages/index/index",
						pagePath: "cuIcon-home",
						text: "首页",
						iconPath: "cuIcon-home",
						// selectedIconPath: "/static/icon/05.png"
						selectedIconPath: "cuIcon-homefill cur"
					},
					{
						text: "统计",
						iconPath: "cuIcon-rank",
						selectedIconPath: "cuIcon-rankfill cur"
					},
					{
						text: "明细",
						iconPath: "cuIcon-tag",
						selectedIconPath: "cuIcon-tagfill cur"
					},
					{
						text: "我的",
						iconPath: "cuIcon-my",
						selectedIconPath: "cuIcon-myfill cur"
					}
				],
				is_ipX:wx.is_ipX,
				bottom_height:wx.bottom_height,
				billList:[],
				income:[],
				expend:[],
				billInfo:{},
				user:{

				},
				navList:[]
			};
		},
		components: {
			bookkeeping,statistics,detailed,me
		},
		onLoad(options){
			this.h=uni.is_ipX
			this.isHome=options.isHome||0
			this.initData()
			// this.go(3)
			// uni.navigateTo({
			// 	url: "../user/login"
			// });
			
		},
		onShow(){
			this.get_userInfo()
		},
		methods: {
			back() {
				uni.navigateBack({
					 delta: 1
				});
			},
			async go(index){
				let is_avatar= this.user.avatarUrl 
                if (index==3&&!is_avatar) {
                    // uni.navigateTo({
                    //     url: '/tools/login/login'
					// });
					// uni.navigateTo({
					// 	url: "../user/login"
					// });
					uni.navigateTo({
						url: "/tools/login/login"
					});
				}else{
					this.cur=index
					
                }
			},
			async initData(){
				let res=await uni.$request({},"bill/index/initData")
				this.income=res.data.income
				this.expend=res.data.expend
				this.navList=res.data.navList
			},
            async get_userInfo(){
				const res=await uni.$request({
                },"api/user/get_userInfo")
                this.user=res.data
			},
	

			/**
			 * tab切换
			 * @param {Object} e
			 */
			tabSelect(e) {
				this.tabCur = e.currentTarget.dataset.id;
				this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60
				uni.$emit('update',e)

			},
			
		}
	}
</script>

<style lang="scss">
	@import "./main.scss";
	.bg-yellow{
		// background:$col;
		background: rgba($color: #000000, $alpha: 0);
	}
	.footer{
		.cur{
			color: $col;
		}
	}
	
	// .cur{
	// 	color: $col !important;
	// }
</style>
<style>
	@import '../../common/qiun.css';
	@import "../../icon.css";
	page{background-color: #f4f5f6;}
</style>
